<!--
@description: 
@creationTime: 2025-04-10
-->

<route type="page" lang="json5">
{
  layout: 'tabBar',
  style: {
    navigationBarTitleText: '我的'
  }
}
</route>

<template>
  <view class="flex mt-3">
    <view class="flex-1">
      <view class="flex">
        <view class="w-20 pl-5 pt-1">
          <wd-img
            :width="60"
            :height="60"
            src="https://bkimg.cdn.bcebos.com/pic/6f061d950a7b02087bf4d1bc4c80e5d3572c11df626e?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080"
            :enable-preview="true"
          />
        </view>
        <view class="flex-1 flex flex-col">
          <text class="font-800 font-size-4 c-#0b0e21 m-2">{{ userInfo.companyName || '未认证' }}</text>
          <text class="font-size-3 c-#9498a2 m-2">{{ userInfo.username }}</text>
        </view>
      </view>
    </view>
    <view class="w-20 flex flex-items-center flex-justify-center c-#9498a2" @click="goDetail">
      <text class="font-size-3">个人中心</text>
      <wd-icon name="arrow-right" size="24rpx"></wd-icon>
    </view>
  </view>

  <view class="flex flex-justify-between m-4 flex-items-center">
    <text class="text-lg font-size-25rpx font-800">我的项目</text>
    <!-- <text class="font-size-3 c-#347cd0">查看全部</text> -->
  </view>

  <view class="mt-2">
    <wd-card>
      <wd-grid :column="4">
        <wd-grid-item icon="picture" text="全部项目" />
        <wd-grid-item icon="picture" text="待勘察" />
        <wd-grid-item icon="picture" text="处理中" />
        <wd-grid-item icon="picture" text="已完成" />
      </wd-grid>
    </wd-card>
  </view>

  <view class="flex flex-justify-between m-4 flex-items-center">
    <text class="text-lg font-size-25rpx font-800">常用功能</text>
    <!-- <text class="font-size-3 c-#347cd0">查看全部</text> -->
  </view>

  <view class="mt-2">
    <wd-card>
      <wd-grid :column="4" :clickable="true">
        <wd-grid-item icon="user" text="我的业主" link-type="navigateTo" url="/pages/my/owner/index?type=customer" />
        <wd-grid-item
          icon="usergroup"
          text="合作伙伴"
          link-type="navigateTo"
          url="/pages/my/staff-hub/index?type=company"
        />
        <wd-grid-item
          icon="user-circle"
          text="员工管理"
          link-type="navigateTo"
          url="/pages/my/staff-hub/index?type=user"
        />
        <wd-grid-item icon="view-module" text="项目管理" link-type="switchTab" url="/pages/project/index" />
        <wd-grid-item icon="picture" text="待我审批" />
        <wd-grid-item icon="picture" text="待我勘察" />
        <wd-grid-item icon="picture" text="模板管理" />
        <wd-grid-item
          icon="picture"
          text="联系人管理"
          link-type="navigateTo"
          url="/pages/my/company-my/company-detail"
        />
      </wd-grid>
    </wd-card>
  </view>

  <view class="mt-2 p7">
    <wd-button type="error" :block="true" @click="logout">退出登录</wd-button>
  </view>
</template>

<script lang="ts" setup>
import { useUserStore } from '@/store'
const { userInfo } = useUserStore()
const goDetail = () => {
  uni.navigateTo({
    url: '/pages/my/company-my/detail'
  })
}
const logout = () => {
  uni.showModal({
    title: '提示',
    content: '确定退出当前账号？',
    success: function (res) {
      if (res.confirm) {
        uni.showLoading({
          title: '退出中...',
          mask: true
        })
        setTimeout(() => {
          uni.hideLoading()
          const { clearUserInfo } = useUserStore()
          clearUserInfo()
        }, 900)
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    }
  })
}
</script>

<style lang="scss" scoped></style>
